//    <!-- 头像部分 -->
.colliys {
    background-color: #ff9700;

    .container {
        .head {
            display: flex;
            justify-content: flex-start;
            align-items: center;

            .pic {
                width: 7rem;
                height: 7rem;
                border-radius: 100%;
                background-color: red;
                background: url("../images/wkl.jpg") no-repeat center center;
                margin-right: 2rem;
            }

            .text {
                width: 60%;
                padding: 2% 0;

                .top {
                    display: flex;
                    justify-content: space-between;

                    .left {
                        color: #fff;
                        font-size: 1rem;

                        span {
                            border-radius: .2rem;
                            background-color: #ccdb38;
                        }
                    }

                    #right {
                        color: #fff;
                    }
                }

                .under {
                    padding-top: 1%;
                    color: #fff;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    -webkit-line-clamp: 2;
                }
            }
        }
    }
}

// news部分
.news {
    margin-bottom: 2rem;

    .container {
        .read {
            .title {
                .left {
                    padding: 2rem 0;
                    color: #31364c;
                    font-size: 2.55rem;
                }
            }

            // 内容部分
            .conten {
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;

                .item {
                    width: 20%;
                    cursor: pointer;
                    box-shadow: .1rem .2rem .5rem #c9cacc;
                    // background-color: green;

                    .top {
                        .video {
                            img {
                                width: 100%;
                            }
                        }

                        .day {
                            width: 90%;
                            margin: auto;

                            margin-top: 1rem;
                            text-indent: 2rem;
                            background: url("../images/icon-h.png") no-repeat left center;
                            background-size: 1.5rem;
                            color: #4e5057;
                        }

                        .post {
                            width: 90%;
                            margin: auto;
                            padding-top: 1rem;
                            color: #31364c;
                            font-size: 1.12rem;

                        }
                    }

                    .center {
                        margin-top: 1rem;
                        // padding-left: .3rem;
                        border-top: 1px solid #ccc;

                        p {
                            padding-top: 1rem;
                            width: 90%;
                            color: #ccc;
                            // background-color: red;
                            font-size: 1.12rem;
                            margin: auto;
                            display: -webkit-box;
                            overflow: hidden;
                            -webkit-box-orient: vertical;
                            text-overflow: ellipsis;
                            -webkit-line-clamp: 3;
                        }

                        .under {
                            padding: 2rem 0;
                            font-size: 1.2rem;
                            color: #ccc;
                            background-color: #f5f5f5;

                            .btns {
                                width: 90%;
                                margin: auto;


                            }
                        }
                    }


                }
            }
        }


    }

    @media screen and (max-width:655px) {
        .container {
            .read {
                .conten {
                    width: 100%;

                    .item {
                        width: 100%;
                        display: flex;
                        justify-content: space-between;
                        flex-wrap: wrap;

                        .top {
                            width: 100%;

                            img {
                                width: 100%;
                            }
                        }

                        .center {
                            .under {
                                background-color: #fff;
                            }
                        }
                    }
                }
            }
        }
    }


}

// leane部分
.leave {

    background-color: #f6f0e4;
    padding-top: 3%;

    .container {
        .comment {


            .walter {

                // 标题
                .com {
                    color: #31364c;
                    font-size: 1.875rem;
                    border-bottom: 1px solid #ccc;
                    padding-bottom: 2%;

                    span {
                        color: #f04e4e;
                    }
                }

                .frank {
                    display: flex;
                    justify-content: flex-start;
                    padding-top: 2%;

                    .pic {
                        img {
                            width: 80%;
                        }
                    }

                    .text {
                        width: 60%;
                        padding: 1.2rem;
                        border-radius: 2rem;
                        background-color: #fafafa;


                        .top {
                            display: flex;
                            justify-content: space-between;

                            .left {

                                color: #31364c;
                                font-size: 1rem;

                                span {
                                    color: #cdcfd7;
                                    font-size: 0.75rem;
                                }
                            }

                            .right {
                                .ago {
                                    color: #cdcfd7;
                                    font-size: 1rem;
                                }
                            }
                        }

                        .under {
                            font-size: 0.875rem;
                            color: #9699a6;
                            padding-top: 1.25rem;
                        }
                    }
                }

                // 文字

            }

            .title {
                padding-top: 3%;
                font-size: 1.875rem;
                color: #31364c;
            }

            form {
                .names {
                    color: #cdcfd7;

                    input {
                        width: 50%;
                        outline: none;
                        border: 0;
                        background-color: #f6f0e4;
                        padding: 1% 0;
                        border-bottom: 2px solid #cdcfd7;
                    }
                }

                textarea {
                    width: 100%;
                    color: #cdcfd7;
                    border: 0;
                    outline: none;
                    resize: none;
                    padding-top: 1.875rem;
                    height: 4.875rem;
                    border-bottom: 2px solid #cdcfd7;
                    background-color: #f6f0e4;

                }

                // 按钮
                .send {
                    padding: 2rem 0;

                    button {
                        border-radius: 30rem;
                        padding: 1.375rem 3.25rem;
                        color: #fff;
                        font-size: 1rem;
                        border: 0;
                        background-color: #8dc63f;
                        transition: all .4s;

                        &:hover {
                            transform: translateY(-.5rem);
                            box-shadow: .1rem .2rem .5rem #31364c;
                        }
                    }
                }
            }
        }


    }
}